<template>
  <div>
    <van-nav-bar title="流程" left-arrow fixed @click-left="back" />
    <dynamic-form :form-el="formEl"></dynamic-form>
    <div class="formSubmitBtn">
      <van-button round block type="info" @click="submitProcess"
        >提交</van-button
      >
    </div>
  </div>
</template>
<script>
import DynamicForm from "@/components/d-form/DynamicForm.vue";
import { Toast } from "vant";

export default {
  name: "home",
  components: { DynamicForm },
  data() {
    return {
      formEl: [
        {
          category: "基本信息",
          items: [
            {
              type: "text",
              key: "",
              label: "项目名称(label过长提示测试)",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "云缴费锁单时间等功能改造",
              showVal: "",
              disabled: true,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "text",
              key: "password",
              label: "需求编号",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "AD1224",
              showVal: "",
              disabled: true,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "select", //表单项类型
              key: "userName", //表单项的id、name
              label: "配置库类型", //标签
              class: "", //样式
              initValFeedType: "", //初始值获取方式none无,function 执行js函数,request 使用ajax请求
              initValFeedTypeText: [
                { key: 1, label: "新建库" },
                { key: 2, label: "测试库" },
              ], //与initValFeedType配合使用， function时为js脚本，ajax请求时为地址、参数信息
              value: "", //表单项的值
              showVal: "新建配置库",
              disabled: false,
              required: true,
              validate: function (item) {
                alert(item)``;
              },
              options: {}, //其他附加项。如添加事件处理等
            },
            {
              type: "person",
              key: "devManager",
              label: "开发经理",
              class: "",
              initValFeedType: "none", //none,function,request
              initValFeedTypeText: null,
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "text",
              key: "supplyName",
              label: "供应商名称",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "开发管理平台",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "text",
              key: "subSysName",
              label: "子系统名称",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "测试软件",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "datetime",
              key: "deployDate1",
              label: "计划上线日期",
              class: "",
              initValFeedType: "none", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "date",
              key: "deployDate2",
              label: "计划上线年月",
              class: "",
              initValFeedType: "none", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "time",
              key: "deployDate3",
              label: "计划上线时间",
              class: "",
              initValFeedType: "none", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "checkbox",
              key: "devLan",
              label: "开发语言",
              class: "",
              initValFeedType: "none", //none,function,request
              initValFeedTypeText: [
                { key: 1, label: "Java" },
                { key: 2, label: "C#" },
                { key: 3, label: "JAVASCRIPT" },
                { key: 4, label: "C++" },
                { key: 5, label: "DELPHI" },
                { key: 6, label: "SHELL" },
                { key: 7, label: "RPG" },
                { key: 8, label: "PYTHON" },
                { key: 9, label: "ABAP" },
                { key: 10, label: "COBOL" },
              ],
              value: [],
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "checkbox",
              key: "configType",
              label: "配置项类型 ",
              class: "",
              initValFeedType: "none",
              initValFeedTypeText: [
                { key: 1, label: "代码" },
                { key: 2, label: "文档" },
                { key: 3, label: "脚本" },
                { key: 4, label: "数据库脚本" },
                { key: 5, label: "配置文件" },
                { key: 6, label: "可执行文件" },
                { key: 7, label: "目标文件" },
                { key: 8, label: "安装文件" },
                { key: 9, label: "其他" },
              ],
              value: [],
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
          ],
        },
        {
          category: "流程信息",
          items: [
            {
              type: "text",
              typeLabel: "",
              key: "test1",
              label: "测试",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "text",
              key: "test2",
              label: "测试",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
            {
              type: "text",
              key: "test3",
              label: "测试",
              class: "",
              initValFeedType: "", //none,function,request
              initValFeedTypeText: "",
              value: "",
              showVal: "",
              disabled: false,
              required: false,
              validate: null,
              options: {},
            },
          ],
        },
      ],
    };
  },
  methods: {
    showData: function () {
      Toast(this.item.value);
    },
    submitProcess: function () {
      let item;
      for (item of this.formEl) {
        let o;
        for (o of item.items) {
          //alert(o)
          console.log(o.key + "=====" + o.value);
        }
      }
    },
    back() {
      this.$router.go(-1);
    },
  },
};
</script>
